<template>
	<div>
		<h2>axios</h2>
		<el-button @click="getData" type="primary">按钮</el-button>
		<div class="md"></div>
		<!-- <suspense>
			<template #default>
				<async-comp />
			</template>
			<template #fallback>
				<h1>加载中...</h1>
			</template>
		</suspense> -->
		<async-comp :person-data="personData"  />
		<comp-table />
	</div>
</template>
<script lang="ts" setup>
import { onMounted, defineAsyncComponent, ref } from "vue";
import { getWeather } from "@/api/index";
import CompTable from "@/components/CompTable/index.vue";
const asyncComp = defineAsyncComponent(() => import("./components/Child.vue"));
onMounted(() => {
	getData();
	getPersonData();
});
const personData: any = ref([]);
function getPersonData() {
	setTimeout(() => {
		personData.value.push(1, 2, 3);
	}, 2000);
}
async function getData(): Promise<void> {
	const res = await getWeather(
		{
			city: "北京"
		},
		{ showLoading: true }
	);
	console.log("res", res);
}
</script>
